<template>
  <div>
    <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add"
      >添加</el-button
    >
    <!-- 列表组件 -->
    <list @edit="edit" ref="list"></list>
    <!-- 弹窗组件 -->
    <info :info="info" @close="info.isshow = false" ref="info" @updata="updata"></info>
  </div>
</template>
<script>
import info from "./info";
import list from "./list";
export default {
  data() {
    return {
      info: {
        isshow: false,
        title: "",
      },
    };
  },
  components: {
    info,
    list,
  },
  methods: {
    add() {
      this.info.isshow = true;
      this.info.title = "添加菜单";
      let data = {
        //父级的id 默认值
        pid: 0,
        title: "",
        icon: "",
        type: 1,
        url: "",
        status: 1,
      };
      this.$refs.info.setValue(data);
    },
    edit(data) {
      this.info.isshow = true;
      this.info.title = "修改菜单";
      this.$refs.info.setValue(data);
    },
    updata(){
      this.$refs.list.getTableData();
    }
  },
};
</script>
<style>
</style>